<template>
  <div class="child">
    <h2>child2(子)</h2>
    <!-- {{ title }} -->
    {{props.id}}
    {{props.name}}
    <input type="text" :value="childInput" @input="$emit('update:childInput', $event.target.value)">
  </div>
</template>

<script setup>
import { defineProps, defineEmits } from 'vue';
// defineProps(['title'])
// const props = defineProps(['title2'])
defineEmits(['update:childInput'])
const props = defineProps({
  id: String,
  name: {
    type: String,
    default: 'name'
  },
  childInput: {
    type: String,
    default: 'name'
  },
})
</script>

<style scoped>
.child{
  background: skyblue;
  padding: 10px;
}
</style>
